<template>
    <ElConfigProvider :locale="zhCn">
        <!-- 整体缩放元素 -->
        <div id="mainApp" :style="{ ...mainAppStyle }">
            <!-- 地图 -->
            <LayoutMap />
            <!-- 布局背景 -->
            <LayoutBg />
            <!-- 头部标题 -->
            <LayoutHeader />
            <!-- 菜单 -->
            <LayoutMenus />
            <!-- 摄像头相关逻辑 -->
            <CameraRelated />
            <!-- 数小助 -->
            <NumSmallHelpMin />
            <!-- 数据总览 -->
            <DataOverview />
            <!-- RouterView -->
            <RouterView v-if="globalStore.mapLoaded" :key="$route.name" />
        </div>
    </ElConfigProvider>
</template>

<script setup lang="ts">
import zhCn from 'element-plus/es/locale/lang/zh-cn'
import LayoutBg from '@/components/LayoutBg/index.vue'
import LayoutHeader from '@/components/LayoutHeader/index.vue'
import LayoutMap from '@/components/LayoutMap/index.vue'
import LayoutMenus from '@/components/LayoutMenus/index.vue'
import CameraRelated from '@/components/CameraRelated/index.vue'
import { useScale } from '@/hooks/useScale'
import { useGlobalStore } from '@/store/global'
import { getHangzhouGeojson } from '@/utils/map-tools/common-map-tools'

// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-expect-error
import NumSmallHelpMin from '@/components/NumSmallHelpMin/index.vue'
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-expect-error
import DataOverview from '@/components/DataOverview/index.vue'
import { set } from 'lodash-es'

// 全局数据
const globalStore = useGlobalStore()
// 容器样式
const { mainAppStyle } = useScale()

// 获取杭州范围数据
getHangzhouGeojson()
</script>
